/**
* Created by ren on 2017/1/4.
*/
<template>
  <div class='loose' style="font-size: 20px">
    <template v-if="_parentThis.looseChild==='parent'">
      <div style="margin-top: 51px;margin-left: 28px;font-size: 20px;color: #666666;margin-bottom: 75px">零钱包余额(元)</div>
      <div style="text-align: center;margin-bottom: 70px">
        <span style="color: #f48315;font-size: 36px">{{cash.split('.')[0]}}.<span style="font-size: 30px">{{cash.split('.')[1]}}</span></span>
      </div>
      <div
        style="line-height: 80px;margin: 0 12px;background: #eeeeee;padding-left: 19px;padding-right: 30px;border-radius: 2px">
        <span>可提现余额(元)</span><span style="float:right;">{{cash}}</span>
      </div>
      <div class="btns">
        <button class="btn btn1" @click="cut('recharge')">充值</button>
        <button class="btn" @click="cut('deposit')">提现</button>
      </div>
    </template>
    <template v-if="_parentThis.looseChild==='recharge'">
      <Recharge></Recharge>
    </template>
    <template v-if="_parentThis.looseChild==='deposit'">
      <Deposit :_parentThis="this"></Deposit>
    </template>
    <template v-if="_parentThis.looseChild==='looseDetail'">
      <LooseDetail :_parentThis="this"></LooseDetail>
    </template>
    <div style="margin-top: 10px;position: absolute;top: 36px;right: 15px;font-size: 18px"
         v-if="_parentThis.looseChild==='parent'">
      <span style="float:right;color:#e6760a;cursor: pointer" @click="cut('looseDetail')">查看零钱包明细？</span>
    </div>
    <Notify :parentThis='this'></Notify>
  </div>
</template>

<script>
  import Recharge from './Recharge'
  import Deposit from './Deposit'
  import LooseDetail from './LooseDetail'
  import API from '../../api'
  import Notify from '../Notify'
  export default {
    name: 'loose',
    components: {
      Recharge,
      Deposit,
      Notify,
      LooseDetail
    },
    props: ['_parentThis'],
    data: function () {
      return {
        cash: '00.00',
        notifyStatus: 2
      }
    },
    methods: {
      cut: function (name) {
        this._parentThis.looseChild = name
        switch (name) {
          case 'parent':
            this._parentThis.titHtml = '<span>零钱包</span>'
            break
          case 'recharge':
            this._parentThis.titHtml = '<span>零钱包 > <span style="color: #f48315;">充值</span></span>'
            break
          case 'looseDetail':
            this._parentThis.titHtml = '<span>零钱包 > <span style="color: #f48315;">查看明细</span></span>'
            break
        }
      },
      findMyAssets: function () {
        this.$http.post(API.findMyAssets, {
          id: this.$cookie.get('id')
        }).then((ret) => {
          const result = ret.body
          if (result.code === 1) {
            this.cash = (result.object.cash / 100).toFixed(2)
          } else {
            this.notifyStatus = '0|' + result.message
          }
        }, (err) => {
          console.log(err)
        })
      }
    },
    updated: function () {
      this.findMyAssets()
    },
    mounted: function () {
      this._parentThis.titHtml = '<span>零钱包</span>'
      this._parentThis.cutName = 'loose'
      this.findMyAssets()
    }
  }
</script>